<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<title>DEMO CANVAS</title>
<link href='http://fonts.googleapis.com/css?family=Roboto+Condensed:300italic,400italic,400,300,700&subset=latin,vietnamese' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,400,300italic&subset=latin,vietnamese' rel='stylesheet' type='text/css'>
	
	<!-- Latest compiled and minified CSS -->
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
	<link rel="stylesheet" href="libs/picker-color/css/pick-a-color-1.2.3.min.css">
	<link rel="stylesheet" href="libs/bxslider/jquery.bxslider.css">
	<link rel="stylesheet" href="css/animate.css">
	<link rel="stylesheet" href="css/style.css">

	<link rel="stylesheet" href="js/module/text.module/text.module.css">
	<link rel="stylesheet" href="css/theme/default/main.menu.css">
	<link rel="stylesheet" href="css/theme/default/general.css">
	<link rel="stylesheet" href="css/theme/default/block.css">
	<link rel="stylesheet" href="css/theme/default/order.css">

	<!-- <link rel="stylesheet" href="css/responsive.css"> -->

</head>
<body class="">

	<div id="main-menu" class="main-menu">
		<div class="metarial"></div>
		<div class="container_CP">
			
			<h1 class="logo"><a>Create Your Own</a></h1>
			<ul class="cus-main-nav my-nav-style my-nav-style-inline">
				<li class="active"><a href="" title="">Trang chủ</a></li>
				<li><a href="" title="">Danh mục sản phẩm</a></li>
				<li><a href="" title="">Trợ giúp</a></li>
				<li><a href="" title="">Bài viết</a></li>
			</ul>
<!-- 			<div class="login-wrapper">
				<ul class="my-nav-style my-nav-style-inline">
					<li><input type="text" class="input" name="" value="" placeholder="username"></li>
					<li><input type="password" class="input" name="" value="" placeholder="password"></i></li>
				</ul>
				<ul class="my-nav-style my-nav-style-inline text-right">
					<li><span>Or login</span></li>
					<li><i class="fa fa-facebook"></i></li>
					<li><i class="fa fa-google"></i></li>
				</ul>
			</div> -->
		</div>

	</div>

	<div id="main-content" class="container_CP">
		<div class="sologan text-center">
			<h2>Hãy lưu trữ khoảnh khắc tuyệt vời của bạn</h2>
			<span>Chỉ cần upload hình ảnh, tự design riêng theo cách của mình, chúng tôi sẽ giúp bạn</span>
		</div>
		<div class="show-case">
			<div class="my-block">
				<div class="khung-anh">
					<img src="imgs/case.jpg" alt="">
				</div>
				<div class="meta-btn">
					<span class="small-sologan">Cá tính với điện thoại</span>
					<button type="button" class="btn btn-default">Case điện thoại</button>
					<button type="button" class="btn btn-default">Skin điện thoại</button>
				</div>
			</div>
			<div class="my-block">
				<div class="khung-anh">
					<img src="imgs/shirt.jpg" alt="">
				</div>
				<div class="meta-btn">
					<span class="small-sologan">Phong cách với áo thun</span>
					<button type="button" class="btn btn-default">Start now</button>
				</div>
			</div>
			<div class="my-block">
				<div class="khung-anh">
					<img src="imgs/canvas.jpg" alt="">
				</div>
				<div class="meta-btn">
					<span class="small-sologan">Tinh tế và cảm xúc với khung ảnh tự tạo</span>
					<button type="button" class="btn btn-default">Create your own</button>
				</div>
			</div>
		</div>


	</div>
	<div class="container_CP">
		<div class="sologan text-center">
			<h2>Demo - Trãi nghiệm ngay</h2>
			<span>Chỉ cần upload hình ảnh, tự design riêng theo cách của mình, chúng tôi sẽ giúp bạn</span>
		</div>
	</div>

	<div id="create-your-own">
	</div>
	<!-- <div class="metarial"></div> -->

	<div class="container_CP">
		<div class="sologan text-center">
			<h2>Chia sẻ tác phẩm của bạn với chúng tôi</h2>
			<span>Chỉ cần upload hình ảnh, tự design riêng theo cách của mình, chúng tôi sẽ giúp bạn</span>
		</div>
		<div class="slider-home my-slide">
			<div class="slider1">
				<div class="slide"><img src="imgs/slide/15.png"></div>
				<div class="slide"><img src="imgs/slide/8.png"></div>
				<div class="slide"><img src="imgs/slide/2.png"></div>
				<div class="slide"><img src="imgs/slide/3.png"></div>
				<div class="slide"><img src="imgs/slide/5.png"></div>
				<div class="slide"><img src="imgs/slide/6.png"></div>
				<div class="slide"><img src="imgs/slide/7.png"></div>
			</div>

		</div>
	</div>

	<div id="footer" class="container_CP">
		<div class="footer-desc">
			Chuyên in hình vỏ điện thoại, in skin dán điện thoại, in khung ảnh, in áo thun. Cho phép thiết kế ngay trên
			website, khách hàng dễ hình dung ra sản phẩm của mình trước khi chúng tôi in sản phẩm.
		</div>
		<div class="copy-right">
			<a href="detroopers.com">Sản phẩm thuộc bản quyền của detropers.com</a>
		</div>
	</div>
	
	<!-- SCRIPT -->
	<script src="libs/jquery-1.11.1.min.js"></script>
	<!-- // <script src="//code.jquery.com/jquery-1.11.2.min.js"></script> -->


	<script src="libs/bxslider/jquery.bxslider.min.js"></script>


	<script src="libs/bootstrap.min.js"></script>
	<script src="libs/tinycolor-0.9.15.min.js"></script>
	<script src="libs/picker-color/js/pick-a-color-1.2.3.min.js"></script>
	<script src="libs/picker-color/js/pick-a-color-1.2.3.min.js"></script>
	<script src="libs/fabric.min.js"></script>
	<script src="libs/handlebars-v2.0.0.js"></script>
	<script src="libs/underscore.min.js"></script>
	<script src="libs/antiforgery.js"></script>
	<script src="libs/mylib.js"></script>
	<script src="libs/util.js"></script>

	<script src="js/config.js"></script>
	<script src="class/myText.js"></script>

	<!-- SERVICE -->
	<script src="js/service/product.js"></script>
	<script src="js/service/orders.js"></script>
	<script src="js/service/asset.js"></script>
	<script src="js/social/facebook.js"></script>
	<script src="js/service/user.storage.js"></script>
	<!-- SERVICE -->

	<script src="js/module/choose.product/choose.product.js"></script>
	<script src="js/module/choose.product/product.item.js"></script>

	<script src="js/module/canvas.composer/main.canvas.js"></script>
	<script src="js/module/save.canvas/save.canvas.js"></script>

	<script src="js/module/text.module/text.module.js"></script>
	<script src="js/module/text.module/text.module.form.js"></script>
	<script src="js/module/text.module/text.module.custom.js"></script>

	<script src="js/module/color.module/color.module.js"></script>
	<script src="js/module/color.module/color.module.controller.js"></script>
	<script src="js/module/color.module/color.module.model.js"></script>
	<script src="js/module/color.module/color.module.view.js"></script>

	<script src="js/module/shape.module/shape.module.js"></script>
	<script src="js/module/shape.module/shape.controller.js"></script>
	<script src="js/module/shape.module/shape.service.js"></script>
	<script src="js/module/shape.module/shape.view.js"></script>

	<script src="js/module/social.module/social.module.js"></script>
	<script src="js/module/social.module/social.controller.js"></script>
	<script src="js/module/social.module/social.view.js"></script>
	<script src="js/module/social.module/social.model.js"></script>
	<script src="js/module/popup.js"></script>

	<script src="js/module/social.module/facebook/popup.facebook.module.js"></script>
	<script src="js/module/social.module/facebook/popup.facebook.albums.js"></script>
	<script src="js/module/social.module/facebook/popup.facebook.photos.module.js"></script>
	<script src="js/module/social.module/facebook/popup.facebook.photos.js"></script>
	<script src="js/module/social.module/facebook/popup.facebook.photos.item.js"></script>

	<script src="js/module/popup.module/popup.module.assets/popup.assets.module.js"></script>
	<script src="js/module/popup.module/popup.module.assets/popup.assets.category.js"></script>
	<script src="js/module/popup.module/popup.module.assets/popup.assets.photo.area.js"></script>
	<script src="js/module/popup.module/popup.module.assets/popup.assets.photo.js"></script>
	<script src="js/module/popup.module/popup.module.assets/popup.assets.photo.item.js"></script>

	<script src="js/module/upload/upload.from.computer/upload.from.computer.controller.js"></script>
	<script src="js/module/upload/upload.from.computer/upload.from.computer.form.js"></script>

	<script src="js/module/upload/upload.from.assets/upload.from.asset.module.js"></script>

	<script src="js/module/upload/display.img.module/display.module.js"></script>
	<script src="js/module/upload/display.img.module/display.module.controller.js"></script>
	<script src="js/module/upload/display.img.module/display.module.model.js"></script>
	<script src="js/module/upload/display.img.module/display.module.view.js"></script>

	<script src="js/module/upload/upload.from.facebook/upload.from.facebook.module.js"></script>

	<script src="js/module/tool.module/tool.module.js"></script>
	<script src="js/module/tool.module/tool.controller.js"></script>
	<script src="js/module/tool.module/tool.service.js"></script>
	<script src="js/module/tool.module/tool.view.js"></script>


	<!-- ORDER -->
	<script src="js/module/order.module.v1/order.module.js"></script>
	<script src="js/module/order.module.v1/order.controller.js"></script>
	<script src="js/module/order.module.v1/step1.module/step1.module.js"></script>
	<script src="js/module/order.module.v1/step2.module/step2.module.js"></script>
	<script src="js/module/order.module.v1/step3.module/step3.module.js"></script>

	<script src="js/leftModule.js"></script>
	<script src="js/rightModule.js"></script>
	<script src="js/control.module.js"></script>
	<script src="js/topModule.js"></script>

	<script src="js/dashboard.js"></script>

	<script src="js/mylib_util.js"></script>
	<script src="js/app.js"></script>


	<script>
		/**
		* Override fbAsyncInit function (window scope) to initialize Facebook SDK after getting JS SDK source
		*/
		window.fbAsyncInit = function() {
			FB.init({
			  appId      : MYLIB.facebook.appid,
			  xfbml      : true,
			  version    : 'v2.1'
			});
		};
		  // Load the SDK asynchronously
		  (function(d, s, id) {
		    var js, fjs = d.getElementsByTagName(s)[0];
		    if (d.getElementById(id)) return;
		    js = d.createElement(s); js.id = id;
		    js.src = "//connect.facebook.net/en_US/sdk.js";
		    fjs.parentNode.insertBefore(js, fjs);
		  }(document, 'script', 'facebook-jssdk'));
	</script>

	<script type="text/javascript">
		var app = new CP.APP_CP();
		app.init('create-your-own');

		//test orders service
		// var order = new CP.OrdersSerice();
		// order.param.data = {'dsd' : 'đsdsds'};

		// var ajax = order.create();
		// ajax.done(function (data){

		// })
	</script>

	<script type="text/javascript">
		jQuery(document).ready(function($) {
			$('.slider1').bxSlider({
			    slideWidth: 200,
			    minSlides: 4,
			    maxSlides: 4,
			    slideMargin: 20
			  });
		});	
	</script>

</body>
</html>